@include('layouts.header')
<div class="layui-layout layui-layout-admin">
    @include("layouts.header-menu")
    @include("layouts.menu")

    <div class="layui-body">
        <!-- 内容主体区域 -->
        <div style="padding: 15px;" class="layui-form">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <input class="layui-input" name="keyword" id="keyword" autocomplete="off"
                           placeholder="关键词">
                </div>
                <div class="layui-inline">
                <select name="class_id" lay-search="">
                    <option value="">选择分类</option>
                    @foreach($category['list'] as $key=>$val)
                        <option value="{{ $val['id'] }}">{{ $val['class_name'] }}</option>
                    @endforeach
                </select>
                </div>
                <button class="layui-btn" lay-submit lay-filter="SearchInst">搜索</button>
            </div>
            <br>
            <table id="infoList" lay-filter="info_list"></table>
            <script type="text/html" id="currentTableBar">
                <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
                <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="delete">删除</a>
            </script>
            <br>
        </div>
    </div>
</div>
@include("layouts.footer")
<script id="category_tpl" type="text/html">
    @{{ d.category.class_name }}
</script>
<script type="text/javascript">
    layui.use(['table', 'element','layer', 'jquery', 'util', 'form'], function() {
        var layer = layui.layer,
            $ = layui.jquery,
            form = layui.form,
            table = layui.table,
            util = layui.util;

        // 搜索
        form.on('submit(SearchInst)', function(data){
            var field = data.field; // 获得表单字段
            // 执行搜索重载
            table.reload('infoList', {
                page: {
                    curr: 1 // 重新从第 1 页开始
                },
                where: field // 搜索的字段
            });
            return false;
        });

        table.render({
            elem: '#infoList'
            ,url: '/business/list' //数据接口
            ,limit: 20
            ,limits: [10, 20, 50, 100, 150, 200, 300, 500, 1000]
            ,page: true //开启分页
            ,toolbar: '#toolbarDemo'
            ,defaultToolbar: ['exports']
            ,cols: [[ //表头
                {field: 'id', title: 'ID', width: 80}
                ,{field: 'title', title: '标题'}
                ,{field: 'category', title: '分类', templet: '#category_tpl'}
                ,{field: 'updated_at', title: '更新时间',  width: 180}
                ,{field: 'created_at', title: '创建时间', width: 180}
                ,{title:'操作',  toolbar: '#currentTableBar', width:200, align: "left", fixed: 'right'}
            ]],
            parseData: function(res){
                return {
                    "code": res.code,
                    "msg":res.msg,
                    "data":res.body['list'],
                    "count":res.body['page']
                }
            }
        });

        table.on('tool(info_list)', function(obj){
            var info_id = obj.data.id;
            if (obj.event == 'delete') {
                layer.confirm('您确定要删除吗？', function (index) {
                    layer.load('loading', {time: 10000});
                    $.get('/business/delete?info_id='+info_id, function(res){
                        layer.closeAll('loading');
                        if (res.code != 0){
                            layer.msg(res.msg, {icon: 2});
                        }else{
                            layer.msg("删除成功", {icon: 1});
                            setTimeout(function(){window.location.reload()}, 2000);
                        }
                    },'json');
                });
            }else if (obj.event == 'edit') {
                window.location.href = '/business/create?info_id='+info_id;
            }
        });

        util.on('lay-on', {
            'task_data': function(){
                layer.tips($(this).data("date"), this, {
                    tips: 1
                });
            }
        });
    });
</script>